import { createElement } from "./createElement"

export default function patchVnode(oldVnode, newVnode) {
  // 判断新旧vnode是否是同一对象
  if(oldVnode === newVnode) return
  // 判断新vnode是否有text属性
  if(newVnode.text && (!newVnode.children || !newVnode.children.length)) {
    if(newVnode.text !== oldVnode.text) {
      oldVnode.elm.innerText = newVnode.text
    }
  } else {
    // 判断oldvnode有没有children
    if(oldVnode.children && oldVnode.children.length) {
      // 老的vnode有children，此时就是最复杂的情况，新老都存在children，需要精细比较
      let un = 0    // 设置指针，控制添加老节点前还是老节点后
      for (let i = 0; i < newVnode.children.length; i++) {
        let ch = newVnode.children[i]
        let isExit = false
        // 再次遍历，看看oldvnode中有没有节点和它是相同的
        for(let j = 0; j < oldVnode.children.length; j++) {
          if(oldVnode.children[j].sel === ch.sel && oldVnode.children[j].key === ch.key) {
            isExit = true
          }
        }
        if(!isExit) {
          let dom = createElement(ch)
          ch.elm = dom

          if(un < oldVnode.children.length) {
            oldVnode.elm.insertBefore(dom, oldVnode.children[un].elm)
          } else {
            oldVnode.elm.appendChild(dom)
          }
        } else {
          // 让处理节点的指针下移
          un++
        }
      }
    } else {
      // 老的vnode没有children，新的存在children
      // 清空老节点的文本
      oldVnode.elm.innerText = ''
      // 遍历新vnode的子节点，创建DOM，并添加至节点内
      for (let i = 0; i < newVnode.children.length; i++) {
        let dom = createElement(newVnode.children[i])
        oldVnode.elm.appendChild(dom)
      }
    }
  }
}